<template>
    <section >
        <!--登陆模块 工厂登录-->
        <login-form v-if="source=='login-factory'" ref="loginForm" @on-login="handleSubmit" :source="source"></login-form>

        <!--登陆模块 游客登录-->
        <login-form v-else-if="source=='login-visitor'" ref="loginForm" @on-login="handleSubmit" :source="source"></login-form>

        <!--登陆模块 账号登录-->
        <fs-login-form v-else-if="source=='login-fs'" ref="loginFormFS" :source="source" :tab="tab" @on-login="handleSubmit"></fs-login-form>
    </section>
</template>

<script>

import LoginForm from './components/login-form'
import FsLoginForm from './components/fs-login-form'
import { mapActions } from 'vuex'

export default {
    name: 'login',
    data(){
        return {
            loading: null,
            source: 'login-fs', //login-factory工厂登录, login-visitor游客登录, login-fs飞书扫码登录
            tab: '',
            user: {},
        }
    },
    components: {
        LoginForm,FsLoginForm
    },
    created() {
        //工厂登录模式
        if(this.$route.query.on == "factory"){
            this.source = "login-factory";
        } else if(this.$route.query.on == "visitor"){
            //游客登录模式
            this.source = "login-visitor";
        }else if(this.$route.query.on == "loading"){
            //扫码后loading模式
            this.loading = this.$loading({
                lock: true,
                text: '登录中',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.8)'
            });
        }else{
            //飞书扫码登录模式
            this.source = "login-fs";
            //飞书主体类型区分
            this.tab = this.$route.query.tab;
        }
    },
    mounted: function (){
        if(this.$route.query.on == "loading"){
            let paramArr = window.location.search.replace("?", "").split("&");
            let queryParam = {};
            for(let str of paramArr){
                let param = str.split("=");
                queryParam[param[0]] = param[1];
            }
            //清除地址栏敏感参数 ?code=&state=
            this.$nextTick(() => {
                let url = window.location.href.replace(window.location.search, "")
                window.history.replaceState(null, null, url);
            })
            console.log("query", queryParam);
            if(queryParam['code'] && queryParam['state']){
                this.handleSubmit({username: queryParam, password: "", source_from: 'fs'})
            }
        }
    },
    methods: {
        ...mapActions([
          'handleLogin',
          'getUserInfo'
        ]),
        //登陆
        handleSubmit ({ username, password, source_from}) {
            if(!this.loading){
                this.loading = this.$loading({
                    lock: true,
                    text: '登录中',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.8)'
                });
            }
            var self = this;
            this.handleLogin({ username, password, source_from, self }).then( isLogin => {
                //延迟关闭loading加载渲染层
                if(this.loading){
                    setTimeout(() => {this.loading.close();}, 1200);
                }else{
                    this.$refs.loginForm  ? this.$refs.loginForm.loginLoading = false : "";
                    this.$refs.loginFormFS ? this.$refs.loginFormFS.fastLoginLoading = false : "";
                }
                if(!isLogin){
                    return;
                }
                this.getUserInfo(self).then(res => {
                    this.$router.push({name: this.$config.homeName})
                });
            });
        },
    }
}
</script>
<style>

</style>
